<template>
	<view>
		<view class="transferoutName">转款</view>
		<view class="transferoutItem">
			<view class="transferoutItemBox">
				<view>顾客编号</view>
				<view>
					<input type='text' placeholder='请输入顾客编号' v-model="transferOutInfo.memberCode"
						placeholder-class='placeholder' disabled></input>
				</view>
			</view>
			<view class="transferoutItemBox">
				<view>账户类型</view>
				<view class="transferOutRadio">
					<radio-group v-model="transferOutInfo.fromAccountType" @change="radioGroupFun">
						<view>
							<radio value="1" />
							充值积分{{consumeAccount}}
						</view>
						<view>
							<radio value="4" />
							消费积分{{specialAccount}}
						</view>
						<view>
							<radio value="2" />
							奖励积分{{bonusAccount}}
						</view>
					</radio-group>
				</view>
			</view>
			<view class="transferoutItemBox">
				<view>转账金额</view>
				<view>
					<input type='number' placeholder='请输入转账金额' v-model="transferOutInfo.transferAmount"
						placeholder-class='placeholder'></input>
				</view>
			</view>
		</view>
		<view class="transferoutName">收款</view>
		<view class="transferoutItem">
			<view class="transferoutItemBox">
				<view>收款人编号</view>
				<view>
					<input type='text' placeholder='请输入收款人编号' :disabled="isdisa" v-model="transferOutInfo.toMemberCode"
						placeholder-class='placeholder' @blur="getMemberByCode"></input>
				</view>
			</view>
			<view class="transferoutItemBox">
				<view>收款人姓名</view>
				<view>
					<input type='text' placeholder='请输入收款人姓名' :disabled="isdisa" v-model="transferOutInfo.MemberName"
						placeholder-class='placeholder'></input>
				</view>
			</view>
			<view class="transferoutItemBox">
				<view>备注</view>
				<view>
					<input type='text' placeholder='请输入备注' v-model="transferOutInfo.memo"
						placeholder-class='placeholder'></input>
				</view>
			</view>
		</view>
		<view class="transferoutName"></view>
		<view class="transferoutItem">
			<view class="transferoutItemBox">
				<view>支付密码</view>
				<view>
					<input type='password' placeholder='请输入密码' v-model="transferOutInfo.payPassword"
						placeholder-class='placeholder'></input>
				</view>
			</view>
		</view>
		<view class="transferoutItem" v-if="transferOutInfo.fromAccountType != '2'">
			<view class="transferoutItemBox">
				<view>短信验证码</view>
				<view style="border:none;position:relative">
					<input type='text' placeholder='请输入验证码' v-model="transferOutInfo.smsCode"
						placeholder-class='placeholder'></input>
					<view class="GetSMS" @click="getSmsCode" v-if="isClickSMS==false">
						<text v-if="smsMessTxtNumber==60">获取验证码</text>
						<text v-if="smsMessTxtNumber<60">再次获取</text>
					</view>
					<view class="GetSMS" v-if="isClickSMS!==false">剩余{{smsMessTxtNumber}}s</view>
				</view>
			</view>
		</view>
		<view class="saveBtn" @click="submitFunc">提交</view>
		<view class="TipsBox">
			<view>说明：</view>
			<view>1、充值积分会转入到对方的充值积分账户。</view>
			<view>2、消费积分会转入到对方的消费积分账户。</view>
			<view>3、奖励积分会转入到自己的消费积分账户。</view>
			<view>4、非服务关系不能互转。</view>
		</view>
	</view>
</template>

<script>
	import {
		getWalletBalance,
		checkMemberCode,
		getTransferOutSmsCode,
		transferOutSubmit
	} from '@/api/directSelling.js'
	export default {
		data() {
			return {
				transferOutInfo: {
					fromAccountType: null,
					MemberName:""
				},
				consumeAccount: 0, //充值积分
				specialAccount: 0, //消费积分
				bonusAccount: 0, //奖励积分
				isClickSMS: false,
				smsMessTxtNumber: 60,
				smsMessFunc: null,
				isdisa:false
			}
		},
		created() {
			this.transferOutInfo.memberCode = uni.getStorageSync('userInfo').memberCode;
			this.getWalletBalance();
		},
		methods: {
			//获取个人账户信息
			getWalletBalance() {
				getWalletBalance().then((res) => {
					let data = res.data;
					this.consumeAccount = data.consumeAccount // 充值积分
					this.specialAccount = data.specialAccount // 消费积分
					this.bonusAccount = data.bonusAccount // 奖励积分
				})
			},
			//获取账户类型数据
			radioGroupFun(e) {
				this.transferOutInfo.fromAccountType = e.detail.value;
				if(this.transferOutInfo.fromAccountType==2){
					this.isdisa=true;
					this.transferOutInfo.toMemberCode=uni.getStorageSync('userInfo').memberCode;
					this.transferOutInfo.MemberName = uni.getStorageSync('userInfo').realName;
				}else{
					this.isdisa=false;
					this.transferOutInfo.toMemberCode="";
					this.transferOutInfo.MemberName="";
				}
			},
			//根据收款人编号获取收款人姓名字段
			getMemberByCode(e) {
				checkMemberCode(e.detail.value).then((res) => {
					let data = res.data;
					this.transferOutInfo.MemberName = data.realName;
				})
			},
			//提交转账申请
			submitFunc() {
				if(!this.transferOutInfo.memberCode){
					this.$util.Tips({
						title: '顾客编号不能为空！'
					});
					return;
				}
				if(!this.transferOutInfo.fromAccountType){
					this.$util.Tips({
						title: '请选择账户类型！'
					});
					return;
				}
				if(!this.transferOutInfo.transferAmount){
					this.$util.Tips({
						title: '请填写转账金额！'
					});
					return;
				}
				if(!this.transferOutInfo.toMemberCode){
					this.$util.Tips({
						title: '请输入收款人编号！'
					});
					return;
				}
				if(!this.transferOutInfo.MemberName){
					this.$util.Tips({
						title: '请输入收款人姓名！'
					});
					return;
				}
				if(this.transferOutInfo.fromAccountType!=='2'){
					if(!this.transferOutInfo.smsCode){
						this.$util.Tips({
							title: '请输入短信验证码！'
						});
						return;
					}
				}
				if(!this.transferOutInfo.payPassword){
					this.$util.Tips({
						title: '请输入支付密码！'
					});
					return;
				}
				console.log(this.transferOutInfo);
				let parse="";
				parse="?fromAccountType="+this.transferOutInfo.fromAccountType+"&transferAmount="+this.transferOutInfo.transferAmount+"&toMemberCode="+this.transferOutInfo.toMemberCode+"&memo="+this.transferOutInfo.memo+"&payPassword="+this.transferOutInfo.payPassword;
				if(this.transferOutInfo.fromAccountType != '2'){
					parse=parse+"&smsCode="+this.transferOutInfo.smsCode;
				}
				//提交提现申请接口格式不对；参数要放置地址栏中进行传参操作。
				transferOutSubmit(parse).then((res)=>{
					let data=res.data;
					if (res.meta.success == true) {
						this.$util.Tips({
							title: '转账成功！'
						});
						setTimeout(()=>{
							uni.navigateTo({
								url: "/pages/electronicWallet/electronicWallet/index"
							});
						},2000)
					}
				})
			},
			//获取短信验证码
			getSmsCode() {
				getTransferOutSmsCode().then((res) => {
					if (res.meta.success == true) {
						this.$util.Tips({
							title: '获取验证码成功！'
						});
						this.isClickSMS = true;
						this.getSmsCodeFunc();
					}
				})
			},
			getSmsCodeFunc() {
				this.smsMessTxtNumber = 60;
				this.smsMessFunc = setInterval(() => {
					if (this.smsMessTxtNumber > 0) {
						this.smsMessTxtNumber = this.smsMessTxtNumber - 1;
					} else {
						clearInterval(this.smsMessFunc);
						this.smsMessFunc = null;
						this.isClickSMS = false;
					}
				}, 1000)
			}
		}
	}
</script>

<style lang="scss">
	.transferoutName {
		width: 100%;
		height: 82rpx;
		line-height: 82rpx;
		color: #999;
		font-size: 30rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
		font-weight: bold;
	}

	.transferoutItem {
		background: #fff;
		padding: 0 30rpx;
		height: auto;
		box-sizing: border-box;

		.transferoutItemBox {
			min-height: 96rpx;
			overflow: hidden;
			display: flex;
			align-items: baseline;

			justify-content: space-between;

			>view:nth-child(1) {
				width: 230rpx;
				line-height: 96rpx;
			}

			>view:nth-child(2) {
				width: calc(100% - 230rpx);
				border: 1px solid #e5e5e5;
				border-radius: 10rpx;
				height: 60rpx;
				padding: 10rpx 20rpx;
				box-sizing: border-box;

				uni-input {
					height: 38rpx;
					line-height: 38rpx;
					min-height: 38rpx;
				}
			}

			.transferOutRadio {
				border: none !important;
				height: auto !important;

				view {
					line-height: 80rpx;
				}
			}
		}
	}

	.GetSMS {
		position: absolute;
		height: 60rpx;
		line-height: 60rpx;
		padding: 0 20rpx;
		border: 1px solid #e5e5e5;
		border-radius: 10rpx;
		right: 0;
		top: 0;
	}

	.saveBtn {
		width: 90%;
		height: 90rpx;
		margin: 50rpx auto;
		line-height: 90rpx;
		background: $theme-color;
		border-radius: 50rpx;
		color: #fff;
		text-align: center;
		font-size: 30rpx;
	}

	.TipsBox {
		padding: 0 30rpx;
		box-sizing: border-box;
		line-height: 70rpx;
		margin-bottom: 40rpx;
		color: $theme-color;
	}
</style>
